<template>
  <div>
    <el-row style="margin-top: 10px">
      <el-table
          :data="list"
          :height="tableHeight"
          style="width: 100%"
          v-loading="loading"
          @selection-change="handleSelectionChange">
        <el-table-column
            type="selection"
            width="50">
        </el-table-column>
        <el-table-column
            label="分配来源"
            prop="assignmentSource"
            align="center"
            width="120">
          <template slot-scope="scope">
            <span v-if="scope.row.assignmentSource === 1">课程计划</span>
            <span v-if="scope.row.assignmentSource === 2">活动室申请</span>
            <span v-if="scope.row.assignmentSource === 3">维修</span>
          </template>
        </el-table-column>
        <el-table-column
            label="分配概述"
            prop="assignmentSummary"
            align="center">
        </el-table-column>
        <el-table-column
            label="分配来源ID"
            prop="assignmentSourceId"
            width="200"
            align="center">
        </el-table-column>
        <el-table-column
            label="周"
            prop="week"
            align="center"
            width="100">
        </el-table-column>
        <el-table-column
            label="节"
            prop="section"
            width="160"
            align="center">
        </el-table-column>
        <el-table-column
            label="使用人"
            prop="user"
            align="center"
            width="100">
        </el-table-column>
      </el-table>
    </el-row>
    <el-row style="margin-top: 10px">
      <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handlePageChange"
          :current-page="this.pagination.page"
          :page-sizes="[5, 10, 20, 50]"
          :page-size="this.pagination.pageSize"
          layout="total, sizes, prev, pager, next"
          :total="this.pagination.total">
      </el-pagination>
    </el-row>
    <!-- 对话框 -->
  </div>

</template>

<script>
import {listAssignments,createAssignments} from "@/api/assignment";
import Formatter from "../../utils/formatter";

export default {
  name: "ClassroomAssignment",
  data() {
    return {
      tableHeight: window.innerHeight - 179,  // 计算表格高度
      currentAssignmentId: '',  // 当前选中设备ID
      list: [],  // 列表数据
      pagination: {
        page: 0,
        pageSize: 10,
        total: 0
      },  // 分页信息
      multipleSelection: [],
      loading: true
    }
  },
  created: function () {
    this.fetchData()
  },
  methods: {

    // 获得数据
    fetchData() {
      listAssignments(1, this.pagination.pageSize).then((response) => {
        this.list = response.data.data.list
        this.pagination = response.data.data.pagination
        this.loading = false
      })
    },


    // 改变每页条数刷新数据
    handleSizeChange(pageSize) {
      listAssignments(1, pageSize).then((response) => {
        this.list = response.data.data.list
        this.pagination = response.data.data.pagination
        this.loading = false
      })
    },

    // 翻页刷新数据
    handlePageChange(page) {
      listAssignments(page, this.pagination.pageSize).then((response) => {
        this.list = response.data.data.list
        this.pagination = response.data.data.pagination
        this.loading = false
      })
    },

    // 多选记录
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    //
    handleCreate() {
      createAssignments().then((response) => {
        this.list = response.data.data.list
        this.pagination = response.data.data.pagination
      })
    },
    // 格式化日期字段
    formatDate: function (row) {
      if (!row.createTime) {
        console.warn('缺少createTime字段值')
        return ''
      }
      return Formatter.formatDate(row.createTime)
    }
  }
}
</script>

<style scoped>

</style>